<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<div class="page-header">
        <button id="btnAdd" type="button" class="btn btn-primary btn-sm">
            <i class="fa fa-user-plus"></i>&nbsp;添加
        </button>
        <button id="btnEdit" type="button" class="btn btn-info btn-sm">
            <i class="fa fa-pencil-square-o"></i>&nbsp;编辑
        </button>
        <button id="btnDel" type="button" class="btn btn-danger btn-sm">
            <i class="fa fa-trash-o"></i>&nbsp;删除
        </button>
</div>
<%--<div class="input-group">
     <input id="searchKey" type="text" class="input form-control" placeholder="资源名称...">
     <span class="input-group-btn">
         <button id="btnSearch" class="btn btn-primary btn-sm" type="button"> <i class="fa fa-search"></i> 搜索</button>
     </span>
</div>--%>
<div class="row" style="margin-top:5px;">
    <div class="col-xs-12 widget-container-col ui-sortable"
         style="min-height: 127px;">
        <!-- #section:custom/widget-box.options.transparent -->
        <div class="widget-box transparent ui-sortable-handle"
             style="opacity: 1; z-index: 0;">
            <div class="widget-header">
                <h4 class="widget-title lighter">资源列表</h4>
                <div class="widget-toolbar no-border">
                    <a href="#" data-action="fullscreen" class="orange2">
                        <i class="ace-icon fa fa-arrows-alt"></i>
                    </a>
                    <a href="#" data-action="collapse" class="green">
                        <i class="ace-icon fa fa-chevron-up"></i>
                    </a>
                </div>
            </div>

            <div class="widget-body" style="display: block;">
                <div class="widget-main padding-6 no-padding-left no-padding-right">
                    <input id="pageNum" type="hidden" value="${page.pageNum }">
                    <input id="pageSize" type="hidden" value="${page.pageSize }">
                    <input id="orderByColumn" type="hidden" value="${page.orderByColumn }">
                    <input id="orderByType" type="hidden" value="${page.orderByType }">
                    <div id="dtGridContainer" class="dlshouwen-grid-container"></div>
                    <div id="dtGridToolBarContainer" class="dlshouwen-grid-toolbar-container"></div>
                </div>
            </div>
        </div>
    </div>
</div>
<script type="text/javascript">
    var dtGridColumns = [{
        id: 'name',
        title: '资源名称',
        type: 'string',
        width: '300px',
        headerClass: 'dlshouwen-grid-header'
    }, {
        id: 'sourceKey',
        title: '资源标识',
        type: 'string',
        columnClass: 'text-center',
        headerClass: 'dlshouwen-grid-header',
        hideType: 'xs'
    }, {
        id: 'type',
        title: '资源类型',
        type: 'string',
        width: '80px',
        columnClass: 'text-center',
        headerClass: 'dlshouwen-grid-header',
        hideType: 'xs',
        resolution: function (value, record, column, grid, dataNo, columnNo) {
            if (value == 0) {
                return '<span class="label label-sm label-success arrowed arrowed-in">菜单</span>';
            } else {
                return '<span class="label label-sm label-info arrowed arrowed-right">按钮</span>';
            }
        }
    }, {
        id: 'icon',
        title: '图标',
        type: 'string',
        width: '50px',
        columnClass: 'text-center',
        headerClass: 'dlshouwen-grid-header',
        hideType: 'sm|xs',
        resolution: function (value, record, column, grid, dataNo, columnNo) {
            if (value != null && value != "") {
                return '<i style="font-size:18px;" class="' + value + ' blue" ></i>';
            } else {
                return '';
            }
        }
    }, {
        id: 'sourceUrl',
        title: '资源url',
        type: 'string',
        //columnClass : 'text-center',
        headerClass: 'dlshouwen-grid-header',
        hideType: 'xs|sm'
    }, {
        id: 'createTime',
        title: '创建时间',
        type: 'date',
        format: 'yyyy-MM-dd hh:mm:ss',
        otype: 'string',
        oformat: 'yyyy-MM-dd hh:mm:ss',
        columnClass: 'text-center',
        headerClass: 'dlshouwen-grid-header',
        hideType: 'xs|sm|md|lg'
    }, {
        id: 'updateTime',
        title: '更新时间',
        type: 'date',
        format: 'yyyy-MM-dd hh:mm:ss',
        otype: 'string',
        oformat: 'yyyy-MM-dd hh:mm:ss',
        columnClass: 'text-center',
        headerClass: 'dlshouwen-grid-header',
        hideType: 'sm|xs|md|lg',
        resolution: function (value, record, column, grid, dataNo, columnNo) {
            if (value == null) {
                return '';
            } else {
                return value;
            }
        }
    }];

    //动态设置jqGrid的rowNum
    var pageSize = $("#pageSize").val();
    pageSize = pageSize == 0 || pageSize == "" ? sys.pageNum : pageSize;

    var treeGridOption = {
        lang: 'zh-cn',
        ajaxLoad: true,
        check: true,
        checkWidth: '37px',
        extraWidth: '37px',
        isTreeGrid: true,
        isLeafColumn: 'isLeaf',
        iconColumn: 'name',
        indexKey: 'id',//主键id 列名,默认值为id
        parentId: 'parentId',//默认值为'parentId'
        loadURL: sys.rootPath + '/resource/listGrid.html',
        columns: dtGridColumns,
        gridContainer: 'dtGridContainer',
        toolbarContainer: 'dtGridToolBarContainer',
        tools: 'refresh|print',
        exportFileName: '资源信息',
        pageSize: pageSize,
        pageSizeLimit: [10, 20, 30]
    };

    var grid = $.fn.dlshouwen.grid.init(treeGridOption);

    $(function () {
        if (null != $("#orderByColumn").val() && '' != $("#orderByColumn").val()) {
            grid.sortParameter.columnId = $("#orderByColumn").val();
            grid.sortParameter.sortType = $("#orderByType").val();
        }

        grid.load();

        initButtonClick();
    });


    /**
     *  初始化绑定按钮事件
     */
    function initButtonClick() {
        $("#btnAdd").click(function () {
            movic.common.addModel('/resource/addUI.html');
        });

        $("#btnEdit").click(function () {
            movic.common.editModel('/resource/editUI.html');
        });

        $("#btnDel").click(function () {
            delResourceModel('/resource/deleteBatch.html', customSearch);
        });

        $("#btnSearch").click(customSearch);

        //注册回车键事件
        document.onkeypress = function (e) {
            var ev = document.all ? window.event : e;
            if (ev.keyCode == 13) {
                customSearch();
            }
        };
    }


    /**
     * 自定义查询
     * 这里不传入分页信息，防止删除记录后重新计算的页码比当前页码小而导致计算异常
     */
    function customSearch() {
        grid.parameters = new Object();
        grid.parameters['name'] = $("#searchKey").val();
        grid.refresh(true);
    }


    /**
     * 删除资源
     */
    function delResourceModel(nav, callback) {
        var rows = grid.getCheckedRecords();
        if (rows.length == 1) {
            var delete_ids = [];
            delete_ids.push(rows[0].id);

            $.ajax({
                type: "POST",
                url: sys.rootPath + '/resource/withoutAuth/validateResource.html',
                data: {
                    "resourceId": rows[0].id
                },
                dataType: "json",
                success: function (result) {
                    if (result.code === 200) {
                        layer.confirm('该资源已授权给部分角色,确认删除吗？', {
                            icon: 3,
                            title: '删除提示'
                        }, function (index, layero) {
                            $.ajax({
                                type: "POST",
                                url: sys.rootPath + nav,
                                data: {
                                    "ids": delete_ids.join(',')
                                },
                                dataType: "json",
                                success: function (result) {
                                    if (result.code === 200) {
                                        layer.msg(result.message, {
                                            icon: 1
                                        });
                                        if (callback) {
                                            callback();
                                        }
                                    } else {
                                        layer.msg(result.message, {
                                            icon: 5
                                        });
                                    }
                                },
                                error: function (errorMsg) {
                                    layer.msg('服务器未响应,请稍后再试', {
                                        icon: 3
                                    });
                                }
                            });
                            layer.close(index);
                        });

                    } else {
                        layer.confirm('确认删除吗？', {
                            icon: 3,
                            title: '删除提示'
                        }, function (index, layero) {
                            $.ajax({
                                type: "POST",
                                url: sys.rootPath + nav,
                                data: {
                                    "ids": delete_ids.join(',')
                                },
                                dataType: "json",
                                success: function (result) {
                                    if (result.code === 200) {
                                        layer.msg(result.message, {
                                            icon: 1
                                        });
                                        if (callback) {
                                            callback();
                                        }
                                    } else {
                                        layer.msg(result.message, {
                                            icon: 5
                                        });
                                    }
                                },
                                error: function (errorMsg) {
                                    layer.msg('服务器未响应,请稍后再试', {
                                        icon: 3
                                    });
                                }
                            });
                            layer.close(index);
                        });
                    }
                },
                error: function (errorMsg) {
                    layer.msg('服务器未响应,请稍后再试', {
                        icon: 3
                    });
                }
            });
        } else {
            layer.msg("你没有选择行或选择了多行数据", {
                icon: 0
            });
        }
    }

</script>

